<template>
	<view id="app">
		<view class="status_bar">
		</view>

		<view class="top">
			<view class="top-box">
				<text class='top-word'>首页</text>
				<input class="top-input" type="text" placeholder="搜索相关信息" />
				
			<!-- 	<image class="top-image  " src="../../../static/images/headerTitle/46873x.png" mode=""></image>
				<image class="top-image" src="../../../static/images/headerTitle/46883x.png" mode=""></image>
			 -->
			</view>
			<swiper class="swiper" autoplay='true' circular='true'>
				<swiper-item>
					<view class="swiper-item">
						<image class="swiper-item-img" src="../../../static/images/headerTitle/613x.png" mode="">
						</image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">
						<image class="swiper-item-img" src="../../../static/images/headerTitle/613x.png" mode="">
						</image>
					</view>
				</swiper-item>
			</swiper>
		</view>
		<!-- 一堆图片 -->
		<view class="prompt">
			<view class="images">
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/47043x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>基金</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/47053x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>股票</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/47063x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>股票</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/47073x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>借钱</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/47083x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>签到</text>
					</view>
				</navigator>
			</view>

			<view class="image">
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/46893x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>抽红包</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/46902x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>信用卡</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/46913x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>活期理财</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/46923x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>税货计算</text>
					</view>
				</navigator>
				<navigator class="images-fir" url="">
					<view class="">
						<image class="images-fir-img" src="../../../static/images/headerTitle/46933x.png" mode="">
						</image>
					</view>
					<view class="images-fir-box">
						<text>客服</text>
					</view>
				</navigator>
			</view>
		</view>

		<!-- 内容 -->
		<view class="contant">
			<!-- A股 -->
			<view class="share">
				<view class="share-price">
					<text class="share-price-one">A股</text>
					<text class="share-price-two">实时金价格</text>
					<text class="share-price-thr">373.00</text>
				</view>
				<view class="share-add">
					<text class="share-add-one">-4.92%</text>
					<text class="share-add-two">-1.12%</text>
				</view>
			</view>

			<!-- 财富直通车 -->
			<view class="Direct-Train">
				<view class="Direct-Train-first">
					<view class="revolution-title">
						<view class="revolution-title-view">
						</view>
						<view class="revolution-title-text">
							<text class="revolution-title-text1">财富直通车</text>
						</view>
					</view>

					<view class="Direct-Train-first-box">
						<view class="Direct-Train-first-box-info">
							<view class="info-left">
								<view class="info-left-text">
									<view class="info-left-text1">
										钱袋子保卫战
									</view>
									<view class="info-left-text2">
										领取你的避坑宝典
									</view>
									<view class="info-left-text3">
										还可<text class="info-left-text33">参与有奖互动</text>
									</view>
									<view class="info-left-text4">
										3月5日-3月8日
									</view>
								</view>
								<view class="info-left-text5">
									立即参与<text class="info-left-text55">></text>

								</view>
							</view>
							<view class="info-right">
								<view class="info-right-niu">
									<view class="info-right-text1">
										牛年有金喜
									</view>
									<view class="info-right-text2">
										每天抽2021元红包
									</view>
									<view class="info-right-text3">
										立即抢购<text class="info-right-text33">></text>
									</view>
								</view>
								<view class="info-right-gua ">
									<view class="info-right-text1">
										瓜分一吨黄金
									</view>
									<view class="info-right-text2">
										年终福利 人人有份
									</view>
									<view class="info-right-text3">
										立即抢购<text class="info-right-text33">></text>
									</view>
								</view>
							</view>

						</view>
					</view>

				</view>
			</view>

			<!-- 贷款服务 -->
			<view class="Direct-Train">
				<view class="Direct-Train-first">
					<view class="revolution-title">
						<view class="revolution-title-view">
						</view>
						<view class="revolution-title-text">
							<text class="revolution-title-text1">贷款服务</text>
						</view>
					</view>

					<view class="Direct-Train-first-box">
						<view class="Train-first-box">
							<view class="Train-first-box-text">
								<text class="Train-first-box-text1">轻松贷款</text>
								<text class="Train-first-box-text2">最低日利率0.02% | 快速提现</text>
							</view>
							<view class="Train-first-box-money">
								<view class="Train-first-box-money1">
									<view class="first-box-money1-y">
										200,000,00
									</view>
									<view class="first-box-money1-text">
										最高可借额度(元)
									</view>
								</view>
								<view class="Train-first-box-btn1">
									获取我的额度
								</view>
							</view>
						</view>
					</view>

				</view>
			</view>
			<!-- 王牌理财热销版 -->
			<view class="Direct-Train">
				<view class="Direct-Train-first">
					<view class="revolution-title">
						<view class="revolution-title-view">
						</view>
						<view class="revolution-title-text">
							<text class="revolution-title-text1">王牌理财热销版</text>
						</view>
					</view>

					<view class="changetitle">
						<view class="changetitle-text active">
							短期精选
						</view>
						<view class="changetitle-text">
							保险理财
						</view>
						<view class="changetitle-text">
							稳健理财
						</view>
						<view class="changetitle-text">
							基金爆品
						</view>
					</view>
					<swiper style='height: 500rpx;'>
						<swiper-item>
							<view class="Direct-Train-first-box">
								<view class="Train-first-box">
									<view class="Train-first-box-text">
										<text class="first-box-text-once">活期理财</text>
										<text class="first-box-text-twos">国金重赢货币</text>
										<text class="first-box-text-thrth">快速货集</text>
									</view>
									<view class="Train-first-box-paid">
										<view class="first-box-paid-huoqi">
											<view class="first-box-paid-huoqi-san">
												3.90%
											</view>
											<view class="first-box-paid-huoqi-qi">
												七日年化收益率
											</view>
										</view>
										<view class="first-box-paid-huoqi">
											<view class="first-box-paid-li">
												灵活救赎
											</view>
											<view class="first-box-paid-huoqi-qi">
												<text>低风险</text>
												<text>100元起购</text>
											</view>
										</view>
										<view class="first-box-paid-btn">
											去抢购
										</view>
									</view>


									<view class="Train-first-box-text">
										<text class="first-box-text-once">报价回购</text>
										<text class="first-box-text-twos">中信建设固收宝</text>
										<text class="first-box-text-thrth">低风险</text>
										<text class="first-box-text-thrth">100元起</text>
									</view>
									<view class="Train-first-box-paid">
										<view class="first-box-paid-huoqi">
											<view class="first-box-paid-huoqi-san">
												6.00%
											</view>
											<view class="first-box-paid-huoqi-qi">
												约定年化收益率
											</view>
										</view>
										<view class="first-box-paid-huoqi">
											<view class="first-box-paid-li">
												28天
											</view>
											<view class="first-box-paid-huoqi-qi">
												<text>先开户</text>
												<text>再购买</text>
											</view>
										</view>
										<view class="first-box-paid-btn">
											去抢购
										</view>
									</view>
								</view>
							</view>
						</swiper-item>
						<swiper-item>
							<view class="swiper-item">hahhaha</view>
						</swiper-item>
					</swiper>
				</view>
			</view>
			<!-- 爆款推荐 -->
			<view class="Direct-Train">
				<view class="Direct-Train-first">
					<view class="revolution-title">
						<view class="revolution-title-view">
						</view>
						<view class="revolution-title-text">
							<text class="revolution-title-text1">爆款推荐</text>
						</view>
					</view>
				</view>
			</view>
			<view class="Baok">
				<scroll-view scroll-x='true'>
					<view class="first-box-tianhong">
						<view class="f-b-th-text">
							天宏永利债券B
						</view>
						<view class="f-b-th-number">
							15.05<text class="f-b-th-text-b">%</text>
						</view>
						<view class="f-b-th-zhang">
							近一年涨幅
						</view>
						<view class="f-b-th-feng">
							<view class="f-b-th-feng-y">
								严控风险
							</view>
							<view class="f-b-th-feng-z">
								债券型
							</view>
						</view>
					</view>


					<view class="first-box-tianhong">
						<view class="f-b-th-text">
							天宏永利债券B
						</view>
						<view class="f-b-th-number">
							15.05<text class="f-b-th-text-b">%</text>
						</view>
						<view class="f-b-th-zhang">
							近一年涨幅
						</view>
						<view class="f-b-th-feng">
							<view class="f-b-th-feng-y">
								严控风险
							</view>
							<view class="f-b-th-feng-z">
								债券型
							</view>
						</view>
					</view>
					<view class="first-box-tianhong">
						<view class="f-b-th-text">
							天宏永利债券B
						</view>
						<view class="f-b-th-number">
							15.05<text class="f-b-th-text-b">%</text>
						</view>
						<view class="f-b-th-zhang">
							近一年涨幅
						</view>
						<view class="f-b-th-feng">
							<view class="f-b-th-feng-y">
								严控风险
							</view>
							<view class="f-b-th-feng-z">
								债券型
							</view>
						</view>
					</view>
				</scroll-view>
			</view>

			<!-- 理财优选 -->
			<view class="Direct-Train">
				<view class="Direct-Train-first">
					<view class="revolution-title">
						<view class="revolution-title-view">
						</view>
						<view class="revolution-title-text">
							<text class="revolution-title-text1">理财优选</text>
						</view>
					</view>
				</view>
			</view>
			<view class="conduct">
				<view class="conduct-financial">
					<view class="conduct-financial-left">
						<view class="c-f-l-number">
							3.90<text class="c-f-l-number1">%</text>
						</view>
						<view class="c-f-l-text">
							业绩比较基准
						</view>
					</view>
					<view class="conduct-financial-right">
						<view class="c-f-r-yj">
							远见开放19号(TG01190000000)
						</view>
						<view class="c-f-r-wy">
							<view class="c-f-r-wy-js1">
								1万元起购
							</view>
							<view class="c-f-r-wy-js2">
								稳健收益
							</view>
							<view class="c-f-r-wy-js3">
								净值型
							</view>
						</view>
					</view>


				</view>
				
				<view class="conduct-financial">
					<view class="conduct-financial-left">
						<view class="c-f-l-number">
							3.90<text class="c-f-l-number1">%</text>
						</view>
						<view class="c-f-l-text">
							业绩比较基准
						</view>
					</view>
					<view class="conduct-financial-right">
						<view class="c-f-r-yj">
							远见开放19号(TG01190000000)
						</view>
						<view class="c-f-r-wy">
							<view class="c-f-r-wy-js1">
								1万元起购
							</view>
							<view class="c-f-r-wy-js2">
								稳健收益
							</view>
							<view class="c-f-r-wy-js3">
								净值型
							</view>
						</view>
					</view>
				
				
				</view>

			</view>
			
			<!-- 财富头条 -->
			<view class="Direct-Train">
				<view class="Direct-Train-first">
					<view class="revolution-title">
						<view class="revolution-title-view">
						</view>
						<view class="revolution-title-text">
							<text class="revolution-title-text1">财富头条</text>
						</view>
					</view>
				</view>
			</view>
			
			<view class="cai-contant">
				<view class="cai-contant-left">
					<view class="cc-l-prictive">
						<image class="cc-l-p-img" src="../../../static/images/headerTitle/46972x.png" mode=""></image>
						<text class="cc-l-p-text">华兴债券</text>
					</view>
					<view class="cc-l-fh">
						手里有闲钱鳄梨利用能让它价值hahha 
					</view>
					<view class="cc-l-tit">
						这是一个很长的标题这是一个很长的标题这是一个很长的标题这是一个很长的标题
					</view>
					<view class="cc-l-time">
						为你推荐.<text class="cc-l-time1">12小时前</text>
					</view>
				</view>
				<view class="cai-contant-right">
					<image class="cc-r-img" src="../../../static/images/headerTitle/4701.png" mode=""></image>
				    <view class="cc-r-text">
					...
				    </view>
				</view>
				
			</view>
			<view class="cai-contant">
				<view class="cai-contant-left">
					<view class="cc-l-prictive">
						<image class="cc-l-p-img" src="../../../static/images/headerTitle/46972x.png" mode=""></image>
						<text class="cc-l-p-text">华兴债券</text>
					</view>
					<view class="cc-l-fh">
						手里有闲钱鳄梨利用能让它价值hahha 
					</view>
					<view class="cc-l-tit">
						这是一个很长的标题这是一个很长的标题这是一个很长的标题这是一个很长的标题
					</view>
					<view class="cc-l-time">
						为你推荐.<text class="cc-l-time1">12小时前</text>
					</view>
				</view>
				<view class="cai-contant-right">
					<image class="cc-r-img" src="../../../static/images/headerTitle/4701.png" mode=""></image>
				    <view class="cc-r-text">
					...
				    </view>
				</view>
				
			</view>
			<view class="cai-contant">
				<view class="cai-contant-left">
					<view class="cc-l-prictive">
						<image class="cc-l-p-img" src="../../../static/images/headerTitle/46972x.png" mode=""></image>
						<text class="cc-l-p-text">华兴债券</text>
					</view>
					<view class="cc-l-fh">
						手里有闲钱鳄梨利用能让它价值hahha 
					</view>
					<view class="cc-l-tit">
						这是一个很长的标题这是一个很长的标题这是一个很长的标题这是一个很长的标题
					</view>
					<view class="cc-l-time">
						为你推荐.<text class="cc-l-time1">12小时前</text>
					</view>
				</view>
				<view class="cai-contant-right">
					<image class="cc-r-img" src="../../../static/images/headerTitle/4701.png" mode=""></image>
				    <view class="cc-r-text">
					...
				    </view>
				</view>
				
			</view>
			<view class="cai-contant">
				<view class="cai-contant-left">
					<view class="cc-l-prictive">
						<image class="cc-l-p-img" src="../../../static/images/headerTitle/46972x.png" mode=""></image>
						<text class="cc-l-p-text">华兴债券</text>
					</view>
					<view class="cc-l-fh">
						手里有闲钱鳄梨利用能让它价值hahha 
					</view>
					<view class="cc-l-tit">
						这是一个很长的标题这是一个很长的标题这是一个很长的标题这是一个很长的标题
					</view>
					<view class="cc-l-time">
						为你推荐.<text class="cc-l-time1">12小时前</text>
					</view>
				</view>
				<view class="cai-contant-right">
					<image class="cc-r-img" src="../../../static/images/headerTitle/4701.png" mode=""></image>
				    <view class="cc-r-text">
					...
				    </view>
				</view>
			</view>
		</view>
		<view class="footer">
			加载更多
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style scoped lang="scss">
	#app {
		background-color: #f3f3f3;
	}

	.status_bar {
		background-color: #3476f1;
		height: var(--status-bar-height);
	}

	.top {
		width: 100%;
		background-color: #3476f1;
		height: 330rpx;
		border-radius: 0 0 40rpx 40rpx;
		.top-box {
			display: flex;
			padding-top: 30rpx;
			.top-word {
				margin-left: 30rpx;
				font-size: 50rpx;
				color: #FFFFFF;
				vertical-align: middle;
			}

			.top-input {
				width: 350rpx;
				height: 60rpx;
				margin-left: 20rpx;
				margin-top: 8rpx;
				background-color: #FFFFFF;
				border-radius: 30rpx;
				vertical-align: middle;
				background-image: url(../../../static/images/headerTitle/9353.png);
				background-repeat: no-repeat;
				background-position: 16rpx;
				text-indent: 16rpx;
				padding-left: 50rpx
			}

			.top-input::placeholder {
				font-size: 24rpx;
				color: #cccccc;

			}

			.top-image {
				width: 48rpx;
				height: 48rpx;
				margin-left: 24rpx;
			}
		}

	}

	.swiper {
		position: relative;
		left: 25rpx;
		top: 80rpx;

		.swiper-item {
			width: 700rpx;
			height: 300rpx;
			border-radius: 10rpx;

			.swiper-item-img {
				width: 700rpx;
				height: 300rpx;
				border-radius: 10rpx;
			}
		}
	}

	.prompt {
		width: 662rpx;
		margin: 0 auto;
		margin-top: 160rpx;
		background-color: #F3F3F3;

		.images {
			padding-top: 20rpx;
			display: flex;
			justify-content: space-around;

			.images-fir {
				text-align: center;

				.images-fir-img {
					width: 88rpx;
					height: 88rpx;
				}
			}

			.images-fir-box {
				margin-top: 18rpx;

				.images-fir-box-text {
					font-size: 24rpx;
					color: #666666;
				}
			}
		}

		.image {
			width: 662rpx;
			margin: 0 auto;
			margin-top: 20rpx;
			padding-bottom: 40rpx;
			display: flex;
			justify-content: space-around;

			.images-fir {
				text-align: center;

				.images-fir-img {
					width: 88rpx;
					height: 88rpx;
				}
			}

			.images-fir-box {
				margin-top: 18rpx;

				.images-fir-box-text {
					font-size: 24rpx;
					color: #666666;
				}
			}
		}
	}


	.contant {
		width: 710rpx;
		margin: 0 auto;
		margin-top: 20rpx;

		.share {
			height: 80rpx;
			display: flex;
			justify-content: space-between;
			box-sizing: border-box;
			background-color: #FFFFFF;

			.share-price {
				padding-left: 30rpx;

				.share-price-one {
					padding-left: 30rpx;
					font-size: 28rpx;
					color: #666666;
					line-height: 80rpx;
				}

				.share-price-two {
					padding-left: 10rpx;
					font-size: 28rpx;
					color: #666666;

				}

				.share-price-thr {
					padding-left: 20rpx;
					font-size: 28rpx;
					color: #f85656;

				}
			}

			.share-add {
				padding-right: 30rpx;

				.share-add-one {
					font-size: 28rpx;
					color: #f85656;
					padding-right: 10rpx;
					line-height: 80rpx;
				}

				.share-add-two {
					font-size: 28rpx;
					color: #f85656;
				}
			}
		}

		.Direct-Train {

			.Direct-Train-first {
				.changetitle {
					margin-top: 10rpx;
					display: flex;
					justify-content: space-between;
					background-color: rgb(240, 240, 240);

					.changetitle-text {
						width: 144rpx;
						height: 48rpx;
						color: #999999;
						font-size: 24rpx;
						line-height: 48rpx;
						text-align: center;
					}
				}

				.revolution-title {
					display: flex;
					// justify-content: space-around;
					padding-top: 44rpx;

					.revolution-title-view {
						width: 8rpx;
						height: 35rpx;
						margin-top: 5rpx;
						border-radius: 5rpx;
						background-color: #007AFF;
					}

					.revolution-title-text1 {
						font-size: 32rpx;
						color: #000000;
						font-weight: bolder;
						margin-left: 10rpx;
						padding: 0;
					}
				}

				.Direct-Train-first-box {
					margin-top: 20rpx;
					border-bottom: 1rps solid #999999;

					.Train-first-box {
						border-radius: 10rpx;
						// background-color: rgb(230,230,230);
						border: 1rpx solid rgb(225, 225, 225);

					}


					.Train-first-box-paid {
						display: flex;
						justify-content: space-between;

						.first-box-paid-huoqi {
							margin-top: 36rpx;
							padding-left: 30rpx;

							.first-box-paid-huoqi-san {
								font-size: 44rpx;
								color: #f85656;
							}

							.first-box-paid-huoqi-qi {
								margin-top: 26rpx;
								margin-bottom: 26rpx;
								font-size: 24rpx;
								color: #868686;
							}

							.first-box-paid-li {
								font-size: 40rpx;
								color: #333333;
								font-weight: bold;
							}
						}

						.first-box-paid-btn {
							width: 174rpx;
							height: 64rpx;
							line-height: 64rpx;
							font-size: 28rpx;
							color: #FFFFFF;
							text-align: center;
							background-color: #3476f1;
							margin-right: 30rpx;
							margin-top: 60rpx;
							border-radius: 4rpx;
						}
					}

					.Train-first-box-text {
						padding-top: 20rpx;

						.first-box-text-once {
							padding-left: 30rpx;
							font-size: 28rpx;
							color: #333333;
						}

						.first-box-text-twos {
							padding-left: 10rpx;
							font-size: 28rpx;
							color: #333333;
						}

						.first-box-text-thrth {
							width: 104rpx;
							height: 36rpx;
							margin-left: 20rpx;
							font-size: 24rpx;

							color: #cd9b53;
							background-color: #f5ecde;
						}

						.Train-first-box-text1 {

							padding-left: 30rpx;
							font-size: 28rpx;
							color: #333333;
						}

						.Train-first-box-text2 {
							padding-left: 20rpx;
							font-size: 24rpx;
							color: #999999;
						}
					}

					.Train-first-box-money {
						display: flex;
						justify-content: space-between;
						margin-top: 54rpx;
						padding-bottom: 40rpx;
						padding-left: 30rpx;

						.Train-first-box-money1 {
							.first-box-money1-y {
								font-size: 44rpx;
								color: #f85656;
								font-weight: bold;
							}

							.first-box-money1-text {
								font-size: 24rpx;
								color: #999999;
								margin-top: 14rpx;

							}
						}

						.Train-first-box-btn1 {
							width: 210rpx;
							height: 60rpx;
							margin-top: 30rpx;
							margin-right: 30rpx;
							font-size: 28rpx;
							color: #FFFFFF;
							text-align: center;
							line-height: 60rpx;
							background-color: #007AFF;
							border-radius: 4rpx;
							box-shadow: 0 0 10rpx 10rpx;
						}
					}

					.Direct-Train-first-box-info {
						display: flex;
						justify-content: space-around;

						.info-left {
							width: 400rpx;
							border-radius: 10rpx;
							// border: 1rpx solid #007AFF;
							background-image: url(../../../static/images/headerTitle/组%204711.png);
							background-repeat: no-repeat;
							background-size: cover;

							.info-left-text {
								margin: 24rpx;

								.info-left-text1 {
									font-size: 40rpx;
									color: #FFFFFF;
									font-weight: bold;
								}

								.info-left-text2,
								.info-left-text4 {
									margin-top: 26rpx;
									font-size: 28rpx;
									color: #ffeed2;
								}

								.info-left-text3 {
									margin-top: 10rpx;
									font-size: 28rpx;
									color: #FFFFFF;

									.info-left-text33 {
										font-size: 32rpx;
										color: #be7f22;
									}
								}

							}

							.info-left-text5 {
								width: 180rpx;
								height: 60rpx;
								text-align: center;
								line-height: 60rpx;
								margin-left: 24rpx;
								margin-top: 120rpx;
								border-radius: 60rpx;
								font-size: 28rpx;
								color: #ffeed2;
								background-color: #FF4500;

								.info-left-text55 {
									margin-left: 12rpx;
								}
							}
						}

						.info-right {
							margin-left: 20rpx;

							.info-right-niu {
								width: 300rpx;
								padding: 24rpx;
								border-radius: 10rpx;
								background-image: url(../../../static/images/headerTitle/47123x.png);
								background-repeat: no-repeat;
								background-size: cover;
							}

							.info-right-gua {
								width: 300rpx;
								padding: 24rpx;
								margin-top: 20rpx;
								border-radius: 10rpx;
								background-image: url(../../../static/images/headerTitle/46963x.png);
								background-repeat: no-repeat;
								background-size: cover;
							}

							.info-right-text1 {
								font-size: 28rpx;
								color: #FFFFFF;
							}

							.info-right-text2 {
								margin-top: 20rpx;
								font-size: 28rpx;
								color: #dcfffa;
							}

							.info-right-text3 {
								width: 174rpx;
								height: 48rpx;
								text-align: center;
								line-height: 48rpx;
								border-radius: 48rpx;
								background-color: #FF4500;
								margin-top: 20rpx;
								margin-bottom: 10rpx;
								font-size: 26rpx;
								color: #FFFFFF;
							}


						}
					}
				}
			}
		}

		// 爆款
		.Baok {
			white-space: nowrap
		}

		.Baok-text {
			display: flex
		}

		.first-box-tianhong {
			width: 300rpx;
			margin-left: 24rpx;
			margin-top: 30rpx;
			text-align: center;
			border: 1rpx solid #FFFFFF;
			background-color: #FFFFFF;
			border-radius: 10rpx;
			display: inline-block;

			.f-b-th-text {
				padding-top: 30rpx;
				font-size: 28rpx;
				color: #333333;
				font-weight: bold;
			}

			.f-b-th-number {
				margin-top: 26rpx;
				font-size: 44rpx;
				color: #f85656;
				font-weight: bold;

				.f-b-th-text-b {
					font-size: 24rpx;
				}
			}

			.f-b-th-zhang {
				margin-top: 20rpx;
				font-size: 24rpx;
				color: #999999;
			}

			.f-b-th-feng {
				display: flex;
				margin-top: 26rpx;
				margin-left: 30rpx;
				padding-bottom: 30rpx;

				.f-b-th-feng-y {
					width: 102rpx;
					height: 40rpx;
					font-size: 20rpx;
					color: #3476f1;
					background-color: rgba(52, 116, 241, 0.1);
					text-align: center;
					line-height: 40rpx;
				}

				.f-b-th-feng-z {
					width: 102rpx;
					height: 40rpx;
					font-size: 20rpx;
					color: #3476f1;
					background-color: rgba(52, 116, 241, 0.1);
					text-align: center;
					line-height: 40rpx;
					margin-left: 20rpx;
				}
				
			}
		}

		.conduct {
			padding-left: 30rpx;
			border: 1rpx solid rgb(230,230,230);
			border-radius: 10rpx;
			margin-top: 20rpx;
			box-shadow: 10rpx;
			.conduct-financial {
				display: flex;
				justify-content: space-between;
				border-bottom:1rpx solid rgb(230,230,230) ;
				.conduct-financial-left {
					padding-top: 30rpx;

					.c-f-l-number {
						font-size: 44rpx;
						color: #f85656;
						font-weight: bold;

						.c-f-l-number1 {
							font-size: 28rpx;
						}
					}

					.c-f-l-text {

						margin-top: 26rpx;
						margin-bottom: 30rpx;
						font-size: 24rpx;
						color: #999999;

					}
				}

				.conduct-financial-right {
					width: 300rpx;
					margin-right: 30rpx;
					

					.c-f-r-yj {
						margin-top: 35rpx;
						font-size: 28rpx;
						color: #333333;
						text-overflow: ellipsis;
						white-space: nowrap;
						/*禁止自动换行*/
						overflow: hidden;
					}

					.c-f-r-wy {
						display: flex;

						.c-f-r-wy-js1 {
							width: 116rpx;
							height: 40rpx;
							margin-top: 26rpx;
							text-align: center;
							line-height: 40rpx;
							font-size: 20rpx;
							color: #3476f1;
							background-color: rgba(52, 116, 241, 0.1);
						}

						.c-f-r-wy-js2 {
							width: 102rpx;
							height: 40rpx;
							margin-top: 26rpx;
							margin-left: 20rpx;
							text-align: center;
							line-height: 40rpx;
							font-size: 20rpx;
							color: #3476f1;
							background-color: rgba(52, 116, 241, 0.1);
						}

						.c-f-r-wy-js3 {
							width: 82rpx;
							height: 40rpx;
							margin-top: 26rpx;
							margin-left: 20rpx;
							text-align: center;
							line-height: 40rpx;
							font-size: 20rpx;
							color: #3476f1;
							background-color: rgba(52, 116, 241, 0.1);
						}
					}
				}
			}
		}

		.cai-contant{
			display: flex;
			justify-content: space-between;
			border: 1rpx solid #FFFFFF;
			border-radius: 10rpx;
			background-color: #FFFFFF;
			margin-top: 30rpx;
			margin-bottom: 10rpx;
			.cai-contant-left{
				width: 400rpx;
				padding-left: 24rpx;
				.cc-l-p-img{
					width: 56rpx;
					height: 56rpx;
					vertical-align: middle;
				}
				.cc-l-p-text{
					margin-left: 20rpx;
					font-size: 28rpx;
					color: #999999;
					vertical-align: middle;
				}
				.cc-l-fh{
					margin-top: 22rpx;
					font-size: 28rpx;
					color: #333333;
					font-weight: bold;
					text-overflow: ellipsis;
					white-space: nowrap;
					/*禁止自动换行*/
					overflow: hidden;
					
				}
				.cc-l-tit{
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
					font-size: 24rpx;
					color: #999999;
					margin-top: 16rpx;
				}
				.cc-l-time{
					margin-top: 30rpx;
					font-size: 24rpx;
					color: #999999;
					.cc-l-time1{
						font-size: 24rpx;
						color: #666666;
					}
				}
				
			}
			.cai-contant-right{
				margin-right: 24rpx;
				margin-bottom:24rpx ;
				.cc-r-img{
					width:200rpx ;
					height: 200rpx;
				}
				.cc-r-text{
					text-align: right;
				}
				
			}
		}
		
		.active {
			background-color: #007AFF;
		}
	}
	.footer{
		// width: 670rpx;
		height: 100rpx;
		text-align: center;
		line-height: 100rpx;
	}
</style>
